In diesem Kapitel schauen wir uns die ersten Schritte in der Programmiersprache JavaScript an.

Was ist JavaScript? JavaScript (J-S) ist eine zumeist client-seitig eingesetzte Skriptsprache, die ursprünglich für dynamisches HTML in Internet-Browsern entwickelt wurde, um Benutzerinteraktionen auszuwerten, Inhalte zu verändern, ohne die Webseite nachzuladen, eine Webseite per Programmcode nachzuladen via Asynchronous JavaScript and XML (AJAX) und um einen Seiteninhalt dynamisch zu generieren. JavaScript wird von allen gängigen Internet-Browsern interpretiert.

Typische Anwendungsgebiete von JavaScript in einem Internet-Browser sind die dynamische Manipulation von Webseiten über das Document Object Model (DOM), die Plausibilitätsprüfung und Datenvalidierung von Formulareingaben noch vor der Übertragung zum Server, die Anzeige von Dialogfenstern, das Senden und Empfangen von Daten, ohne dass der Browser die Seite neu laden muss, das Vorschlagen von Suchbegriffen während der Eingabe, die Anzeige von Werbebannern oder Laufschriften sowie die Verschleierung von E-Mail-Adressen zur Bekämpfung von Spam.

JavaScript ist Turing-vollständig und erfüllt damit die Kriterien einer vollwertigen Programmiersprache. JavaScript ist vollständig dynamisch typisiert; die Zuweisung von Werten an Variablen unterliegt keinen typbasierten Einschränkungen. Aufgrund dessen ist der Datentyp keine Eigenschaft einer Variablen, sondern Laufzeit-bezogen die Eigenschaft ihres aktuellen Wertes. Der Datentyp eines Wertes lässt sich zur Laufzeit mit dem unären Operator typeof ermitteln.

Hier sehen Sie HTML, JavaScript und CSS als Basistechnologien des Clients. Während HTML für die Seitenstruktur und den Inhalt zuständig ist und CSS für das Layout und Design, kümmert sich JavaScript um die Interaktion und um das Verhalten der Webseite.

Und hier sehen Sie noch, wie diese Technologien in welchem Kontext zum Einsatz kommen. Üblich ist die Anwendung von allen drei Technologien, wobei reines HTML sowie HTML und CSS unter Umständen für die Barrierefreiheit interessant sein kann.

Es gibt verschiedene Wege JavaScript in HTML einzubetten: Entweder intern, oder extern oder über die DOM-API. Die Reihenfolge der Einbettung ist wichtig, da der Code auf alle vor ihm eingebunden externen oder internen Dateien zugreifen kann. Die Scripte werden geladen und ausgeführt, sobald der Parser auf ein Script-Tag stößt. JavaScript-Code kann auf allen vor ihm eingebundenen externen oder internen Code zugreifen. Die dritte Variante hat nur wenige Anwendungsfälle wie zum Beispiel das Einbinden von Google Maps Code. Es sollte generell die externe Variante bevorzugt werden.

Hier sehen Sie die interne Einbettung durch den script-Tag im Head des HTML-Dokuments. Der alert sorgt für eine Popup-Meldung. Das noscript-Element ist von Bedeutung, wenn JavaScript client-seitig im Browser abgeschaltet ist.

Hier sehen Sie die Einbindung einer externen JavaScript-Datei. Diese Einbindung erfolgt üblicherweise auch im Head des HTML-Dokuments, hier aber unmittelbar vor dem Ende des HTML-Dokuments. Eine späte Einbindung erfolgt oft dann, wenn innerhalb der JavaScript-Datei auf den DOM-Baum des HTML zugegriffen werden soll. Denn für den Zugriff muss der DOM-Baum bereits vollständig geladen sein.

Während der Laufzeit kann mittels der DOM-API ein Script-Element erzeugt und anschließend dem DOM hinzugefügt werden. Somit kann JavaScript selbst dynamisch zur Laufzeit JavaScript-Code erzeugen und ausführen.

JavaScript wird im Browser in einer sogenannten Sandbox ausgeführt. Dies bewirkt, dass man in JavaScript im Allgemeinen nur Zugriff auf die Objekte des Browsers hat und somit nicht auf das Dateisystem zugreifen und dadurch keine Dateien lesen oder schreiben kann. Um Sicherheitsprobleme, wie das sogenannte Cross-Site-Scripting zu verhindern, wird jede Website oder Webanwendung innerhalb des Browsers isoliert ausgeführt und ein Datenaustausch unterbunden. Ohne diesen Schutz wäre es möglich, über eine Seite Schadcode auszuführen, der beispielsweise Bank- oder Logindaten in anderen parallel geöffneten Browserfenstern ausliest oder manipuliert.